@import "../scss/mixin";
@import "../scss/common";
@import "../scss/animate";

.themBlue {
  color: $themBlue;
}

.blue1Color {
  color: $font-color-blue1;
}

.redColor {
  color: $font-color-red;
}

.greenColor {
  color: $font-color-green;
}

.ogColor {
  color: $iy-orange;
}

.greenColor2BC {
  background-color: $font-color-green2;
}

.switcher-wrap {
  position: relative;
  width: 100%;
  height: 40px;
  line-height: 40px;
  background-color: #fff;
  border-bottom: 1px solid #d8d8d8;
  @include flex-display;
  @include flex-row;
  .si {
    @include flex-size(1);
    height: 100%;
    text-align: center;
    box-sizing: border-box;
    transition: color .6s;
    &:active {
      font-size: 15px;
      color: #007aff;
    }
  }
  .switcher-active {
    color: #007aff;
    border-bottom: 2px solid #007aff;
  }
}

.data-list-wrap {
  width: 100%;
  .d-item {
    padding: 8px;
    border-radius: 4px;
    background-color: #fff;
    @include flex-display;
    @include flex-align-center;
    margin: 10px;
    .i-content {
      @include flex-size(1);
      @include wordHidden;
      .i-title {
        font-size: 15px;
        @include wordHidden;
      }
      .i-name {
        font-size: 14px;
        margin-top: 6px;
      }
      .i-time {
        margin-top: 4px;
        font-size: 12px;
        color: $font-color-gray;
      }
    }
    .i-img {
      width: 44px;
      height: 44px;
      margin-right: 10px;
      background-color: #3da7f3;
      border-radius: 22px;
      @include flex-display;
      @include flex-pack-center;
      @include flex-align-center;
      .iconfont {
        font-size: 22px;
        color: #fff;
      }
      .icon-tsgl {
        font-size: 26px;
      }
    }
    .warn1 {
      background-color: $font-color-red;
    }
    .warn2 {
      background-color: #ffa381;
    }
    .warn3 {
      background-color: #ffeb3b;
    }
    .warn4 {
      background-color: #2999f7;
    }
    .warn0 {
      background-color: #d2d0d0;
    }
    @mixin state($font,$icon,$txt) {
      font-size: 13px;
      position: relative;
      padding-left: 20px;
      color: $font;
      height: 20px;
      line-height: 20px;
      &:before {
        @include iconCode($icon);
        font-size: 17px;
        color: $font;
        position: absolute;
        top: 0;
        left: 0;
      }
      &:after {
        content: $txt;
        font-size: 13px;
      }
    }
    .i-state-pend {
      @include state($font-color-red, "\e699", "待办")
    }
    .i-state-done {
      @include state($font-color-green, "\e629", "已办")
    }
    .i-state-doing {
      @include state($themBlue, "", "批示中")
    }
    .i-state-complete {
      @include state($font-color-gray, "", "办结")
    }
    .i-state-plan1 {
      @include state($iy-orange, "", "待执行")
    }
    .i-state-plan2 {
      @include state($themBlue, "", "执行中")
    }
  }
}

.watch-style {
  display: inline-block;
  padding: 0 2px;
  color: $blue1;
  //font-weight: 600;

}

.d-item-wrap {
  .d-title {
    @include titleWrap;
  }
  .d-content {
    @include contentWrap;
    .item {
      @include contentItem;
      .label {
        @include itemLabel;
      }
      .txt {
        @include itemTxt;
        .input-c {
          color: #7c7c7c;
          font-size: 14px;
          width: 100%;
          border: none;
          background-color: #fff;
          text-align: right;
        }
        .input-h {
          height: 38px;
          text-align: left;
        }
      }
      .txt {
        @include itemTxt;
        .input-c {
          color: #7c7c7c;
          font-size: 14px;
          width: 100%;
          border: none;
          background-color: #fff;
          text-align: right;
        }
        .input-h {
          height: 38px;
          text-align: left;
        }
      }
      .link-wrap {
        @include itemLink;
      }
      .files {
        @include itemFiles;
      }
      .txt-area {
        text-indent: 4px;
        height: 160px;
        width: 100%;
        line-height: 22px;
        border: none;
      }
      .title {
        @include wordHidden_2;
        margin-top: 6px;
        margin-bottom: 8px;
        line-height: 20px;
        font-size: 16px;
      }
      .news-s {
        @include flex-display;
        @include flex-align-center;
        @include wordHidden;
        font-size: 14px;
        .content {
          @include flex-size(1);
          font-size: 14px;
        }
        .btn-d {
          @include btn-small(#fff, $green);
          z-index: 100;
          @include clickActive;
        }
      }
      .drag-wrap {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 40px;
        @include flex-display;
        @include flex-align-center;
        @include flex-pack-center;
        .iconfont {
          font-size: 38px;
          //color: $themBlue;
        }
      }
      .close-wrap {
        position: absolute;
        top: 0;
        right: 4px;
        z-index: 100;
        .iconfont {
          font-size: 20px;
          color: $red;
        }
      }
      .icon-xing {
        color: $red;
        font-size: 20px;
        margin-right: 2px;
      }
      .important {
        display: inline-block;
        padding: 0 4px;
        color: #f03f3d;
        border: 1px solid #f04c49;
        border-radius: 4px;
        font-size: 12px;
        margin-right: 2px;
      }
      .txt-checked-item-wrap {
        //margin-top: 8px;
      }
      .txt-checked-item {
        position: relative;
        display: inline-block;
        padding: 4px 4px;
        border: 1px solid #7292d8;
        background-color: #6b8dd8;
        border-radius: 4px;
        color: #fff;
        font-size: 13px;
        margin: 4px 6px;
        &:after {
          @include iconCode("\e601");
          font-size: 14px;
          color: #fff;
        }
      }
      .txt-noPad {
        padding-left: 0;
      }
      .txt-checked-item-file {
        display: block;
        background-color: #fff;
        color: #6b8dd8;
        margin-top: 8px;
        position: relative;
        padding-right: 18px;
        &:after {
          position: absolute;
          top: 4px;
          right: 4px;
          color: #ff9868;
        }
      }
      .txt-checked-item-file-1 {
        &:after {
          display: none;
        }
      }
      .file-a {
        width: 100%;
        height: 100%;
        z-index: 99;
      }
      .zj-file {
        padding-right: 26px;
        &:after {
          @include muiIconCode("\e403");
          font-size: 20px;
          color: #2196f3;
          position: absolute;
          right: 2px;
          top: 1px;
        }
      }
      .txt-multiChose-item-wrap {
        position: relative;
      }
      .txt-multiChose-item {
        display: block;
        border: 1px solid #e3e3e3;
        background-color: #fff;
        color: #6d6d6d;
        position: relative;
        padding: 6px 30px 6px 6px;
        border-radius: 4px;
        font-size: 13px;
        margin-top: 8px;
        transition: all .6s;

      }
      .multi-checkbox {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        opacity: 0;
        z-index: 1;
        &:checked + div {
          background-color: #4fabf5;
          color: #fff;
          &:after {
            @include muiIconCode("\e472");
            position: absolute;
            top: -7px;
            right: -6px;
            display: inline-block;
            font-size: 42px;
            color: #fff;
          }
        }
      }
      .voice-icon-wrap {
        float: right;
        display: inline-block;
        width: 30px;
        .icon-voice {
          font-size: 22px;
          color: #6ba4ea;
        }
      }
      .plus-txt-wrap {
        position: absolute;
        top: 4px;
        right: 0;
        @include btn-small;
      }
      .file-wrap {
        width: 100%;
        height: 100%;
        position: relative;
      }
      .file-input {
        opacity: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
      }
      .txt2 {
        min-height: 14px;
        line-height: 14px;
      }
      .txt-chose {
        margin-top: 6px;
      }
      .txt-multiLine {
        white-space: pre-line;
        margin-top: -10px;
      }
    }
    .edit-item {
      padding-left: 40px;
      padding-right: 20px;
    }
    .fold-hide {
      &:nth-child(n+3):before {
        display: none;
      }
      &:nth-child(n+4) {
        display: none;
      }
    }
    .inline-wrap {
      @include itemInlineWrap;
    }
  }
  .btn-edit {
    position: absolute;
    top: 5px;
    right: 8px;
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 12px;
    background-color: #03a9f4;
    color: #fff;
  }
  .btn-plus {
    position: absolute;
    top: 5px;
    right: 8px;
    padding: 6px;
    border-radius: 4px;
    font-size: 12px;
    background-color: #3caff4;
    color: #fff;
    width: 40px;
    text-align: center;
  }
  .add-btn {
    position: absolute;
    top: 2px;
    right: 0;
    @include btn-small;
  }
}

.feedBack-item {
  min-height: 32px;
  padding: 6px 0;
  font-size: 14px;
  @include flex-display;
  @include flex-align-center;
  .btn {
    @include btn-small(#fff, #2196f3);
  }
  .fb-label {
    min-width: 80px;
    text-align: right;
  }
  .fb-ct {
    flex: 1;
  }
}

@mixin action_icon($code) {
  &:before {
    @include iconCode($code);
    padding-right: 6px;
    font-size: 28px;
  }
}

.action-icon-call {
  @include action_icon("\e62d");
}

.action-icon-chat {
  @include action_icon("\e612");
}

.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  background-color: $themBlue;
  color: #fff;
  border-bottom: 1px solid #d8d8d8;
  .wrap {
    position: relative;
  }
  $height: 40px;
  @mixin _height {
    height: $height;
    line-height: $height;
    text-align: center;
  }
  .b {
    position: absolute;
    left: 0;
    top: 0;
    width: 46px;
    font-size: 22px;
    @include _height;
    &:active .b-i {
      font-size: 26px;
    }
    .b-i {
      font-size: 22px;
      font-weight: 700;
    }
  }
  .r {
    position: absolute;
    top: 0;
    right: 0;
    margin-right: 6px;
    font-size: 20px;
    @include _height;
    &:active .b-i {
      font-size: 26px;
    }
    .b-i {
      font-size: 22px;
      font-weight: 700;
    }
  }
  .con {
    font-size: 14px;
  }
  .t {
    margin: 0 88px;
    position: relative;
    width: auto;
    font-weight: 400;
    font-size: 16px;
    @include wordHidden;
    @include _height;
  }
}

.fragments {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
  z-index: 1;
  background-color: #f0eff5;
  .container-wrap {
    position: absolute;
    top: 40px;
    left: 0;
    width: 100%;
    height: 100%;
    //height: calc(100% - 40px);
    //height: -webkit-calc(100% - 40px);
    overflow: hidden;
    z-index: 1;
    background-color: #f0eff5;
  }
  .container-wrap2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 40px);
    height: -webkit-calc(100% - 40px);
    overflow: hidden;
    z-index: 1;
    background-color: #f0eff5;
  }
  .container-y {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 1;
    background-color: #f0eff5;
  }
}

.pdb {
  height: 60px;
  width: 100%;
}

.btn-wrap {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 16px;
  @mixin btn($bc,$bac) {
    border-radius: 2px;
    width: 100%;
    height: 36px;
    line-height: 36px;
    font-size: 16px;
    text-align: center;
    margin: 12px auto;
    color: #fff;
    background-color: $bc;
    border: 1px solid $bac;
    transition: background-color .2s ease;
    &:active {
      border: 1px solid $bc;
      background-color: $bac;
      color: #d8d8d8;
    }
  }
  .btn-b {
    @include btn($themBlue, #0d85ea);
  }
  .btn-g {
    @include btn(#dd524d, #ff6d50);
  }
}

.neededFlag {
  position: relative;
  width: 8px;
  height: 12px;
  display: inline-block;
  &:before {
    content: "*";
    position: absolute;
    left: 0;
    top: -3px;
    font-size: 24px;
    color: #ff2b18;
  }
}

.check-input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 1;
  + div {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 30px;
  }
  + div > div {
    position: relative;
    height: 100%;
    width: 100%;
    @include flex-display;
    @include flex-pack-center;
    @include flex-align-center;
    &:before {
      @include iconCode("\e603");
      font-size: 20px;
      color: #cccccc;
    }
  }
  &:checked + div > div:before {
    @include iconCode("\e629");
    font-size: 24px;
    color: #32c832;
  }
}

.pull-wrap {
  position: relative;
  width: 100%;
  height: calc(100% - 40px);
  overflow: hidden;
}

.home-list-ul {
  width: 100%;
  overflow-x: hidden;
  background-color: #fff;
  .home-list-item {
    display: block;
    padding: 15px 10px 10px 10px;
    min-height: 72px;
    cursor: pointer;
    position: relative;
    @include bord_bottom(10px);
    .title {
      line-height: 20px;
      font-size: 14px;
      color: #333;
      margin-bottom: 5px;
      @include text-overflow-ellipsis(2);
    }
    .time {
      display: flex;
      min-height: 20px;
      align-items: center;
      color: #707070;
      font-size: 13px;
      @include wordHidden;
      .rt {
        flex: 1;
        font-size: 13px;
        text-align: right;
        @include wordHidden;
      }
      .rt2 {
        font-size: 14px;
        text-align: right;
        padding: 4px 8px;
        color: #fff;
        display: inline-block;
        border-radius: 4px;
        box-sizing: content-box;
      }
      .l1 {
        background-color: #ff4947;
      }
      .l2 {
        background-color: #f08501;
      }
      .l3 {
        background-color: #ffc501;
      }
      .l4 {
        background-color: #37a7f9;
      }
      .l5 {
        background-color: #b9cbd9;
      }
    }
  }
}

.typeMultiChose-wrap {
  width: 100%;
  .tm-ul {
    display: flex;
    flex-wrap: wrap;
  }
  .tm-li {
    position: relative;
    height: 30px;
    line-height: 30px;
    width: 33.3333333333%;
    display: flex;
    align-items: center;
    cursor: pointer;
    $size: 16px;
    .tm-check-icon {
      margin: 0 6px;
      display: inline-block;
      width: $size;
      height: $size;
      line-height: $size;
      border: 1px solid #eaeaea;
      position: relative;
      text-align: center;
    }
    .tm-ip {
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      z-index: 1;
      &:checked + .tm-check-icon {
        &:before {
          @include iconCode("\e631");
          font-size: 18px;
          color: #64a5c8;
          font-weight: 600;
        }
      }
    }
    .tm-txt {
      flex: 1;
      @include wordHidden;
      font-size: 14px;
    }
  }
  .tm-ul-file {
    display: flex;
    flex-wrap: nowrap;
  }
  .tm-li-file {
    width: 100%;
  }
}

.loading-wrap {
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  z-index: 99;
  text-align: center;
  @include flex-display;
  @include flex-align-center;
  @include flex-pack-center;
  .loading {
    width: 100%;
    height: 60px;
    @include flex-display;
    @include flex-align-center;
    @include flex-pack-center;
    font-size: 15px;
  }
  .mui-progressbar {
    height: 3px;
  }
  .nodata-icon {
    display: inline-block;
    padding: 16px 0;
    font-size: 38px;
    color: $gray;
  }
  .nodata-txt {
    font-size: 14px;
  }
}

.blur-loading-wrap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.loading-wrap1 {
  background-color: rgba(255, 255, 255, 0.7);
  height: 100%;
  font-size: 15px;
  color: #646464;
}

.blur-loading {
  background-color: rgba(255, 255, 255, 0.5);
  //-webkit-filter: blur(16px);
  //-moz-filter: blur(16px);
  //-ms-filter: blur(16px);
  //-o-filter: blur(16px);
  //filter: blur(8px);
}

//自定义下拉刷新样式
.mescroll-downwarp .downwarp-tip, .mescroll-upwarp .upwarp-tip, .mescroll-upwarp .upwarp-nodata {
  //margin-top: 10px;
  font-size: 13px;
}

.mescroll {
  color: #656565;
  .downwarp-arrow {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 10px 4px;
    vertical-align: middle;
    -webkit-transition: all 300ms;
    transition: all 300ms;
    &:before {
      display: inline-block;
      font-family: Muiicons;
      font-size: 26px;
      font-style: normal;
      font-weight: 400;
      line-height: 1;
      text-decoration: none;
      -webkit-font-smoothing: antialiased;
      content: "\e588";
    }
  }
  .downwarp-tip {
    font-weight: 500;
    font-size: 13px;
  }
  .downwarp-progress, .upwarp-progress {
    width: 36px;
    height: 36px;
    border: none;
    margin: auto;
    background: url("../img/loading.gif") no-repeat center;
    background-size: 22px;
  }
}

.contacts-ul {
  border-top: 1px solid #d8d8d8;
  border-bottom: 1px solid #d8d8d8;
  background-color: #fff;
  $mh: 32px;
  .contacts-li {
    position: relative;
    height: 44px;
    @include flex-display;
    @include flex-align-center;
    @include bord_bottom(12px, 1);
    @include clickActive;
    .img-h {
      height: $mh;
      width: $mh;
      margin-left: 12px;
      margin-right: 6px;
      //border-radius: 16px;
      border-radius: 4px;
      overflow: hidden;
    }
    .checkInput {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      z-index: 11;
    }
    .checkInput-org {
      position: absolute;
      top: 0;
      right: 0;
      width: 16%;
      height: 100%;
      opacity: 0;
      z-index: 11;
    }
    .txtWrap {
      font-size: 14px;
      height: 100%;
      width: 100%;
      @include flex-size(1);
      @include flex-display;
      @include flex-align-center;
      .name {
        @include flex-size(1);
        @include wordHidden;
      }
      .nameOnly {
        padding-left: 14px;
      }
      .checkIcon {
        position: relative;
        height: 44px;
        line-height: 44px;
        padding-right: 12px;
        &:before {
          @include iconCode("\e603");
          font-size: 20px;
          color: #cccccc;
        }
      }
      .teamIcon {
        position: relative;
        height: 44px;
        line-height: 44px;
        padding-right: 12px;
        &:before {
          @include iconCode("\e6cd");
          font-size: 38px;
          color: #6994e4;
        }
      }
    }
    .checkInput:checked + .txtWrap .name, .checkInput-org:checked + .txtWrap .name {
      color: #00c893;
    }
    .checkInput:checked + .txtWrap .checkIcon, .checkInput-org:checked + .txtWrap .checkIcon {
      &:before {
        @include iconCode("\e629");
        font-size: 24px;
        color: #32c832;
      }
    }
  }
}

.advice-wrap {
  .title {
    @include titleWrap;
  }
  .content {
    @include contentWrap;
    .item {
      @include contentItem;
      color: $font-color-blue1;
      .top {
        position: relative;
        font-size: 14px;
        .iconfont {
          padding-left: 6px;
          padding-right: 6px;
          font-size: 22px;
          color: #f37f52;
        }
        .time {
          position: absolute;
          top: 6px;
          right: 10px;
          font-size: 13px;
        }
      }
      .txt {
        word-break: break-all;
        padding-left: 12px;
        padding-top: 6px;
        padding-bottom: 4px;
        color: $themFont;
      }
    }
    .fold-hide {
      &:nth-child(n+3):before {
        display: none;
      }
      &:nth-child(n+4) {
        display: none;
      }
    }
  }
}

.phone-icon {
  padding-left: 6px;
  padding-right: 6px;
  font-size: 22px;
  color: #f37f52;
}

.actionSheet-warp {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 999;
  .gray-cover {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    @include gray_cover;
  }
  $action_br: 5px;
  .action-ul {
    position: relative;
    padding: 4px 20px;
    width: 100%;
    text-align: center;
    color: #007aff;
    border-radius: $action_br;
    overflow: hidden;
  }
  .action-li {
    position: relative;
    height: 43px;
    background-color: #fff;
    font-size: 16px;
    @include flex-display;
    @include flex-align-center;
    @include flex-pack-center;
    &:active {
      font-size: 15px;
    }
    border-bottom: 1px solid #c8c7cc;
    &:first-child {
      border-top-left-radius: $action_br;
      border-top-right-radius: $action_br;
    }
    &:last-child {
      border: none;
      border-bottom-left-radius: $action_br;
      border-bottom-right-radius: $action_br;
    }
  }
  .action-cancel {
    font-weight: 600;
    color: $red;
    margin-bottom: 8px;
  }
}

.wordHidden-2 {
  @include wordHidden_2;
}

.orgWrap {
  $ht: 34px;
  background-color: #fff;
  padding-left: 8px;
  height: $ht;
  width: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  .orgWrap-li {
    position: relative;
    display: inline-block;
    height: $ht;
    line-height: $ht;
    font-size: 14px;
    padding-right: 24px;
    &:first-child {
      padding-left: 29px;
    }
    &:first-child:before {
      color: #d8d8d8;
      position: absolute;
      top: -13px;
      left: -15px;
      display: inline-block;
      font-family: Muiicons;
      font-size: 62px;
      font-style: normal;
      font-weight: 100;
      line-height: 1;
      text-decoration: none;
      -webkit-font-smoothing: antialiased;
      content: "\E583";
    }
    &:last-child {
      color: #2196f3;
    }
    &:after {
      color: #d8d8d8;
      position: absolute;
      top: -13px;
      right: -15px;
      display: inline-block;
      font-family: Muiicons;
      font-size: 62px;
      font-style: normal;
      font-weight: 100;
      line-height: 1;
      text-decoration: none;
      -webkit-font-smoothing: antialiased;
      content: "\E583";
    }
  }
}

.infoBody {
  > div {
    padding: 10px 12px;
    background-color: #fff !important;
    font-size: 14px;
  }
  .zj1 {
    margin-top: 5px;
  }
  .db-content textarea {
    width: 100%;
    height: 140px;
  }
  .bt2 {
    border-top: 1px solid #e2e2e2;
  }
  .bt {
    border-bottom: 1px solid #e2e2e2;
  }
  .d-content {
    border: none !important;
  }
}

.iy-wrap .iy-desc {
  background: #fff;
  .desc-bd {
    padding: 10px 12px;
  }
}

.desc-header {
  border-bottom: 1px solid #e2e2e2;
  padding-bottom: 8px;
  h3 {
    word-break: break-all;
    @include text-overflow-ellipsis(2);
    text-align: left;
    line-height: 24px;
    font-size: 15px;
    margin-bottom: 5px;
    color: #333;
  }
  .dh-sec {
    line-height: 20px;
    color: #666;
    margin-bottom: 5px;
    min-height: 20px;
    span {
      float: left;
      //width: 50%;
      //@include text-overflow-nowrap-ellipsis();
    }
    label {
      color: #999;
    }
  }
}

.desc-body {
  padding: 15px 0;
  h6 {
    color: #444;
    line-height: 24px;
    font-size: 15px;
    font-weight: 500;
  }
  .db-content {
    line-height: 22px;
    margin-bottom: 5px;
    min-height: 30px;
    font-size: 14px;
    color: #666;
    word-break: break-all;
  }
  .file-btn {
    display: block;
    background: #f8f8f8;
    height: 30px;
    line-height: 30px;
    border-radius: 5px;
    padding: 0 8px;
    color: #58b5ff;
    margin-bottom: 5px;
    @include text-overflow-nowrap-ellipsis();
    border: 1px solid #e0e0e0;
    span {
      float: right;
      color: #999;
    }
  }
}

.desc-footer {
  label {
    display: block;
    line-height: 20px;
    word-break: break-all;
    @include text-overflow-ellipsis(2);
  }
  text-align: left;
  color: #999;
  line-height: 20px;
  a {
    color: #2196f3;
  }
}

.desc-scope {
  border-bottom: 1px solid #e2e2e2;
  padding: 10px 0;
  h3 {
    text-align: left;
    line-height: 24px;
    font-size: 15px;
    margin-bottom: 5px;
    color: #333;
  }
  p, div {
    line-height: 20px;
    margin-bottom: 4px;
    color: #666;
    padding-left: 40px;
    min-height: 20px;
    position: relative;
    word-break: break-all;
    label {
      position: absolute;
      left: 0;
      top: 0;
      width: 42px;
      text-align: right;
      color: #999;
    }
  }
}

.iy-bg-green {
  background: $iy-green;
}

.iy-bg-yellow, .il-bg-3 {
  background: $iy-yellow !important;
}

.iy-bg-blue, .il-bg-4 {
  background: $iy-blue;
}

.iy-bg-red, .il-bg-1 {
  background: $iy-red;
}

.iy-bg-orange, .il-bg-2 {
  background: $iy-orange !important;
}

.il-bg-5 {
  background: #8a8a8a;
}

.searchList-wrap {

}

.search-wrap {
  position: relative;
  background-color: #eee;
  height: 40px;
  box-sizing: border-box;
  padding: 6px;
  .search-m {
    position: relative;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    border-radius: 13px;
    @include flex-display;
    @include flex-align-center;
    font-size: 14px;
    border: 1px solid #d8d8d8;
    overflow: hidden;
    background-color: #fff;
    .s-input {
      width: 100%;
      height: 100%;
      border: none;
      background-color: #fff;
    }
    .icon-fangdajing {
      font-size: 18px;
      color: #949494;
      margin: 0 6px;
    }
  }
}

.step-wrap {
  padding-top: 12px;
  padding-bottom: 12px;
  padding-right: 12px;
  padding-left: 40px;
  background-color: #fff;
  margin: 12px 0;
  position: relative;
  //border-top: 1px solid #d8d8d8;
  //border-bottom: 1px solid #d8d8d8;

  .step-item {
    position: relative;
    margin: 12px 0;
    min-height: 51px;
    &:before {
      content: "";
      position: absolute;
      top: 20px;
      left: -20px;
      height: 51px;
      width: 1px;
      background-color: #687ccf;
    }
    &:last-child:before {
      display: none;
    }
  }
  .sc {
    $sh: 22px;
    position: absolute;
    top: 0;
    left: -31px;
    height: $sh;
    width: $sh;
    border-radius: 50%;
    border: 1px solid #687ccf;
    background-color: #fff;
    z-index: 10;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .s1 {
    font-size: 15px;
    margin-bottom: 4px;
  }
  .s2 {
    font-size: 13px;
    color: $font-color-gray;
  }
  .s3 {
    background-color: #687ccf;
    color: #fff;
  }
}

.info-push-flag-event {
  @include txtBtn(#5787ff)
}

.info-push-flag-risk {
  @include txtBtn(#ff856f)
}

.valid-error {
  border-bottom: 2px solid rgba(255, 87, 34, .6);
}

.container-y1 {
  top: 40px;
  background-color: #fff
}

